export default {
  props: {
    value: [String, Number, Object],
    row: Object,
    column: [String, Array],
    options: Object
  },
  render(h) {
    const { cellOptions } = this.options || {}
    var _opts = {}
    var slots = {}
    var cellData = this.row
    if (this.value && typeof this.value === 'object') {
      Object.keys(this.value).forEach(vk => {
        cellData[this.column + '.' + vk] = this.value[vk]
      })
    }
    if (cellOptions) {
      Object.keys(cellOptions).forEach(key => {
        var attribute = cellOptions[key]
        if (Array.isArray(attribute)) {
          var context = []
          for (var i = 0; i < attribute.length; i++) {
            var attr = attribute[i]
            if (cellData[attr]) {
              context.push(
                h(
                  'span',
                  {
                    attrs: {
                      class: 'mr-1'
                    }
                  },
                  cellData[attr]
                )
              )
            }
          }
          // var context = attribute.map(attr => {
          //   return h(
          //     'span',
          //     {
          //       attrs: {
          //         class: 'mr-1'
          //       }
          //     },
          //     cellData[attr]
          //   )
          // })
          slots[key] = () =>
            h(
              'div',
              {
                attrs: {
                  class: 'split-inline'
                }
              },
              context
            )
        } else {
          _opts[key] = cellData[attribute]
        }
      })
    }
    return h('em-cell', {
      attrs: Object.assign(_opts, {
        type: 'goods',
        clickable: true
      }),
      scopedSlots: slots,
      on: {
        click: () => {
          this.$emit('click', 'preview')
        }
      }
    })
  }
}
